<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html lang="zxx">

<head>
<title>Checkout</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script>
	addEventListener("load", function() {
		setTimeout(hideURLbar, 0);
	}, false);

	function hideURLbar() {
		window.scrollTo(0, 1);
	}
</script>
<!-- Custom Theme files -->
<link href="css/bootstrap.css" type="text/css" rel="stylesheet"
	media="all">
<!-- shop css -->
<link href="css/shop.css" type="text/css" rel="stylesheet" media="all">
<!-- checkout css -->
<link href="css/checkout.css" type="text/css" rel="stylesheet"
	media="all">
<link href="css/style.css" type="text/css" rel="stylesheet" media="all">
<!-- font-awesome icons -->
<link href="css/font-awesome.css" rel="stylesheet">
<!-- //Custom Theme files -->
<!-- online-fonts -->
<!-- logo -->
<link href="http://fonts.googleapis.com/css?family=Fredericka+the+Great"
	rel="stylesheet">
<!-- titles -->
<link
	href="http://fonts.googleapis.com/css?family=Merriweather+Sans:300,300i,400,400i,700,700i,800,800i"
	rel="stylesheet">
<!-- body -->
<link
	href="http://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i"
	rel="stylesheet">
<!-- //online-fonts -->
</head>


<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">

	<div id="home">
		<!-- header -->
		<!-- navbar -->
		<nav class="navbar navbar-default navbar-fixed-top">
		<div class="main-nav">
			<div class="container">

				<div class="navbar-header page-scroll">
					<button type="button" class="navbar-toggle" data-toggle="collapse"
						data-target=".navbar-ex1-collapse">
						<span class="sr-only">Chronicle</span> <span class="icon-bar"></span>
						<span class="icon-bar"></span> <span class="icon-bar"></span>
					</button>
					<h1>
						<a class="navbar-brand" href="index.jsp">eBook</a>
					</h1>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse navbar-ex1-collapse nav-right">
					<ul class="nav navbar-nav navbar-left cl-effect-15">
						<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
						<li class="hidden"><a class="page-scroll" href="#page-top"></a>
						</li>
						<li><a href="index.jsp">主页</a></li>
						<li class="active"><a href="about-us.html">关于我们</a></li>
						<li class="dropdown"><a href="#"
							class="dropdown-toggle effect-3" data-toggle="dropdown">商城 <b
								class="caret"></b>
						</a>
							<ul class="dropdown-menu">
								<li><a href="shop.jsp">图书目录</a></li>
								<li><a href="single_product.jsp">单个图书</a></li>

							</ul></li>

						<li><a href="javascript:userMessagefun('${user.userName}')"
							title="个人信息"> <span class="fa fa-user nav-icon"
								aria-hidden="true"></span>
						</a></li>

					</ul>
					<!-- search-bar -->
					<div class="search-bar-agileits">
						<div class="cd-main-header">
							<ul class="cd-header-buttons">
								<li><a class="cd-search-trigger" href="#cd-search"> <span></span>
								</a></li>
							</ul>
							<!-- cd-header-buttons -->
						</div>
						<div id="cd-search" class="cd-search">
							<form action="#" method="post">
								<input name="Search" type="search"
									placeholder="Type and Hit Enter...">
							</form>
						</div>
					</div>
					<!-- //search-bar ends here -->
					<!-- shopping cart -->
					<div class="cart-mainf">
						<div class="chrcart chrcart2 cart cart box_1">
							<form action="#" method="post" class="last">
								<input type="hidden" name="cmd" value="_cart"> <input
									type="hidden" name="display" value="1">
								<button class="top_chr_cart" type="submit" name="submit"
									value="">
									<i class="fa fa-cart-arrow-down" aria-hidden="true"></i>
								</button>
							</form>
						</div>
					</div>
					<!-- //shopping cart ends here -->
				</div>
				<!-- /.navbar-collapse -->
				<div class="clearfix"></div>
			</div>
			<!-- /.container -->
		</div>
		</nav>
		<!-- //navbar ends here -->
		<!-- banner -->
		<div class="banner-bg-inner">
			<!-- banner-text -->
			<div class="banner-text-inner">
				<div class="container">
					<h2 class="title-inner">爱阅电子书城</h2>

				</div>
			</div>
			<!-- //banner-text -->
		</div>
		<!-- //banner -->
		<!-- breadcrumbs -->
		<div class="crumbs text-center">
			<div class="container">
				<div class="row">
					<ul class="btn-group btn-breadcrumb bc-list">
						<li class="btn btn1"><a href="index.jsp"> <i
								class="glyphicon glyphicon-home"></i>
						</a></li>
						<li class="btn btn2"><a href="shop.jsp">图书目录</a></li>
						<li class="btn btn3 btn3a"><a href="single_product.jsp">单本</a></li>
						<li class="btn btn4"><a href="shoppingcar.jsp">购物车</a></li>
					</ul>
				</div>
			</div>
		</div>
		<!--//breadcrumbs ends here-->
		<!--checkout-->
		<div class="innerf-pages section">
			<div class="container">
				<div class="privacy about">
					<h4 class="rad-txt">
						<span class="abtxt1">查看</span> <span class="abtext">订单详情</span>
					</h4>
					<div class="search-hotel">
						<h3 class="shopf-sear-headits-sear-head">
							<span>订单详情</span> 查询
						</h3>
						<form action="OrdersDetailsServlet" method="post">
							<input type="search" placeholder="请在这查询" name="search"
								id="search"> <input type="submit" value="Search">
							<input type="hidden" name="op" value="search" />
						</form>
					</div>
					<div class="checkout-right">
						<table class="timetable_sub table-responsive">
							<thead>
								<tr>
									<th>流水号</th>
									<th>订单号</th>
									<th>图书编号</th>
									<th>书名</th>
									<th>购买数量</th>
									<th>总价</th>
									<th>地址</th>
									<th>电话</th>
								</tr>
							</thead>
							<tbody>
								<c:if test="${list!=null}">
									<!-- 存在数据，遍历输出 -->
									<c:forEach items="${list}" var="od">
										<tr>
											<td>${od.waterId}</td>
											<td>${od.orderId}</td>
											<td>${od.bookId}</td>
											<td>${od.bookName}</td>
											<td>${od.bookCount}</td>
											<td>${od.bookPrice}</td>
											<td>${od.addr}</td>
											<td>${od.tel}</td>
										</tr>
									</c:forEach>
								</c:if>
							</tbody>
						</table>

						<div class="col-md-8 address_form"></div>

						<div class="clearfix"></div>

					</div>

				</div>

			</div>
		</div>
		<!--//checkout-->


		<!-- Common js -->
		<script src="js/jquery-2.2.3.min.js"></script>
		<!--// Common js -->
		<!-- cart-js -->
		<script src="js/minicart.js"></script>
		<script>
			chr.render();

			chr.cart.on('new_checkout', function(evt) {
				var items, len, i;

				if (this.subtotal() > 0) {
					items = this.items();

					for (i = 0, len = items.length; i < len; i++) {
					}
				}
			});
		</script>
		<!-- //cart-js -->
		<!--quantity-->
		<script>
			$('.value-plus')
					.on(
							'click',
							function() {
								var divUpd = $(this).parent().find('.value'), newVal = parseInt(
										divUpd.text(), 10) + 1;
								divUpd.text(newVal);
							});

			$('.value-minus')
					.on(
							'click',
							function() {
								var divUpd = $(this).parent().find('.value'), newVal = parseInt(
										divUpd.text(), 10) - 1;
								if (newVal >= 1)
									divUpd.text(newVal);
							});
		</script>
		<!--quantity-->
		<!-- FadeOut-Script -->
		<script>
			$(document).ready(function(c) {
				$('.close1').on('click', function(c) {
					$('.rem1').fadeOut('slow', function(c) {
						$('.rem1').remove();
					});
				});
			});
		</script>
		<script>
			$(document).ready(function(c) {
				$('.close2').on('click', function(c) {
					$('.rem2').fadeOut('slow', function(c) {
						$('.rem2').remove();
					});
				});
			});
		</script>
		<script>
			$(document).ready(function(c) {
				$('.close3').on('click', function(c) {
					$('.rem3').fadeOut('slow', function(c) {
						$('.rem3').remove();
					});
				});
			});
		</script>
		<!--// FadeOut-Script -->

		<!-- dropdown nav -->
		<script>
			$(document).ready(
					function() {
						$(".dropdown").hover(
								function() {
									$('.dropdown-menu', this).stop(true, true)
											.slideDown("fast");
									$(this).toggleClass('open');
								},
								function() {
									$('.dropdown-menu', this).stop(true, true)
											.slideUp("fast");
									$(this).toggleClass('open');
								});
					});
		</script>
		<!-- //dropdown nav -->
		<!--search jQuery-->
		<script src="js/main.js"></script>
		<!--search jQuery-->

		<!-- Scrolling Nav JavaScript -->
		<script src="js/scrolling-nav.js"></script>
		<!-- //fixed-scroll-nav-js -->
		<!--//scripts-->
		<!-- start-smooth-scrolling -->
		<script src="js/move-top.js"></script>
		<script src="js/easing.js"></script>
		<script>
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event) {
					event.preventDefault();

					$('html,body').animate({
						scrollTop : $(this.hash).offset().top
					}, 1000);
				});
			});
		</script>
		<!-- //end-smooth-scrolling -->
		<!-- smooth-scrolling-of-move-up -->
		<script>
			$(document).ready(function() {
				/*
				var defaults = {
				    containerID: 'toTop', // fading element id
				    containerHoverID: 'toTopHover', // fading element hover id
				    scrollSpeed: 1200,
				    easingType: 'linear' 
				};
				 */

				$().UItoTop({
					easingType : 'easeOutQuart'
				});

			});
		</script>
		<script src="js/SmoothScroll.min.js"></script>
		<!-- //smooth-scrolling-of-move-up -->
		<!-- Bootstrap core JavaScript
 ================================================== -->
		<!-- Placed at the end of the document so the pages load faster -->
		<script src="js/bootstrap.js"></script>
		<script>
		<!--跳转到个人信息-->
			function userMessagefun(userName) {
				location.href = "http://localhost:8080/love_reading_ebook_city/UserServlet?op=userMessage&userName="
						+ userName;
			}
		</script>
</body>

</html>